<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>Balloon tooltip</title>
	
	<link rel="stylesheet" href="css/bubble-tooltip.css" media="screen">
	<script type="text/javascript" src="js/bubble-tooltip.js"></script>
</head>
<body>
<div id="bubble_tooltip">
	<div class="bubble_top"><span></span></div>
	<div class="bubble_middle"><span id="bubble_tooltip_content">Content is comming here as you probably can see.Content is comming here as you probably can see.</span></div>
	<div class="bubble_bottom"></div>
</div>
<h1>DHTML Balloon tooltip</h1>
<p>This demo demonstrates how the balloon tooltip works. Roll your mouse over the red links in the text below.</p>
<p><a href="#" onmouseover="showToolTip(event,'This is a simple<br>, simple tesThis is a simple, <br>simple tesThis is a simple<br>, simple tesThis is a simple, simple test');return false" onmouseout="hideToolTip()">Roll over me</a> to see the tooltip in action.</p>
<p>And here's some more content
<a href="xx" onmouseover="showToolTip(event,'This.');return false" onmouseout="hideToolTip()">Roll over me</a> </p>
<p>This is the last piece of the content on this web page</p>
</body>
</html>